import { Meta, Story, Preview, Props } from '@storybook/addon-docs/blocks';
import Button from 'components/Button';

<Meta title="Components/Button" component={Button} />

# Button

Html button.

## Props
<Props of={Button} />


## Examples

### Basic

Basic usage for ``Button`` Component, using type to customize button styles.

<Preview>
  <Story name="basic buttons">
    <div>
      <Button type="primary">Kube Design</Button>
      <Button type="control">Kube Design</Button>
      <Button>Kube Design</Button>
      <Button type="danger">Kube Design</Button>
      <Button type="flat">Kube Design</Button>
      <Button disabled>Kube Design</Button>
    </div>
  </Story>
</Preview>


### With Icon
Passing ``icon`` prop to ``Button``.

<Preview>
  <Story name="buttons with icon">
    <div>
      <Button icon="add">Kube Design</Button>
      <Button icon="add" />
      <Button icon="add" type="flat" />
      <Button icon="add" disabled />
    </div>
  </Story>
</Preview>

### Loading
Passing ``loading`` prop to ``Button``.

<Preview>
  <Story name="button loading">
    <div>
      <Button loading={true}>Kube Design</Button>
    </div>
  </Story>
</Preview>
